<template>
  <div>
    <a-modal
      width="80%"
      :title="title"
      :maskClosable="false"
      :destroyOnClose="true"
      :visible.sync="editModalVisible"
      @cancel="handleCancleDbSync"
    >
      <template slot="footer">
        <a-button @click="handleCancleDbSync">
          关闭
        </a-button>
        <a-button type="primary" :loading="syncLoading" @click="handleDbSync" >确定</a-button>
      </template>
      <div class="table-page-search-wrapper warp">
        <a-form-model layout="horizontal" :label-col="labelCol" :wrapper-col="wrapperCol" labelAlign="right" ref="ruleForm" :model="formData" :rules="rules">
          <a-row :gutter="24">
            <a-col :xl="8" :lg="8" :md="8" :sm="24" >
              <a-form-model-item class="form-item"  label="项目名称" prop="projectName">
                <a-input v-model="formData.projectName" :disabled="disableSubmit" placeholder="请输入项目名称"/>
              </a-form-model-item>
            </a-col>
            <a-col :xl="8" :lg="8" :md="8" :sm="24" >
              <a-form-model-item class="form-item"  label="项目编码" prop="projectCode">
                <a-input v-model="formData.projectCode" :disabled="disableSubmit" placeholder="请输入项目编码"/>
              </a-form-model-item>
            </a-col>
            <a-col :xl="8" :lg="8" :md="8" :sm="24">
              <a-form-model-item class="form-item" label="时间" prop="time">
                <a-range-picker :disabled="disableSubmit" v-model="formData.time"/>
              </a-form-model-item>
            </a-col>
            <a-col :xl="8" :lg="8" :md="8" :sm="24">
              <a-form-model-item class="form-item" label="项目类型">
                <j-dict-select-tag
                  :disabled="disableSubmit"
                  v-model="formData.projectType"
                  placeholder="请选择项目类型"
                  dict-code="pms_project_type"
                >
                </j-dict-select-tag>
              </a-form-model-item>
            </a-col>
            <a-col :xl="8" :lg="8" :md="8" :sm="24">
              <a-form-model-item class="form-item" label="项目经理" prop="projectManager">
                <j-select-multi-user :maxTagCount="2" :multiple="false" :disabled="!isManager || disableSubmit" v-model="formData.projectManager" ></j-select-multi-user>
              </a-form-model-item>
            </a-col>
            <a-col :xl="8" :lg="8" :md="8" :sm="24">
              <a-form-model-item class="form-item" label="项目助理">
                <j-select-multi-user :maxTagCount="2" :disabled="!isManager || disableSubmit" v-model="formData.projectAssistant" ></j-select-multi-user>
              </a-form-model-item>
            </a-col>
            <a-col :xl="8" :lg="8" :md="8" :sm="24">
              <a-form-model-item class="form-item" label="成员">
                <j-select-multi-user :maxTagCount="2" :disabled="!isManager ||disableSubmit" :multiple="true" v-model="formData.projectMember" ></j-select-multi-user>
              </a-form-model-item>
            </a-col>
            <a-col :xl="8" :lg="8" :md="8" :sm="24">
              <a-form-model-item class="form-item" label="抄送人">
                <j-select-multi-user :maxTagCount="2" :disabled="disableSubmit" v-model="formData.ccMember"></j-select-multi-user>
              </a-form-model-item>
            </a-col>
            <a-col :xl="8" :lg="8" :md="8" :sm="24">
              <a-form-model-item class="form-item" label="归属部门">
                <j-select-depart :multi="false" v-model="formData.departCode" :disabled="disableSubmit" :rootOpened="false"></j-select-depart>
              </a-form-model-item>
            </a-col>
            <a-col :xl="8" :lg="8" :md="8" :sm="24">
              <a-form-model-item label="父专案"  width="100%">
                <j-dict-select-tag type="list" v-model="formData.parentProject" dictCode="pms_project,project_name,project_code,ISNULL(parent_project)" placeholder="请选择父专案"/>
              </a-form-model-item>
            </a-col>
            <a-col :xl="8" :lg="8" :md="8" :sm="24">
              <a-form-model-item label="产品"  width="100%">
                <j-dict-select-tag type="list" v-model="formData.productCode" dictCode="pms_product,name,product_code" placeholder="请选择产品"/>
              </a-form-model-item>
            </a-col>
            <a-col :xl="8" :lg="8" :md="8" :sm="24" >
              <a-form-model-item class="form-item"  label="专案效益" prop="projectBenefits">
                <a-input type="number" v-model="formData.projectBenefits" :disabled="disableSubmit" placeholder="请输入专案效益"/>
              </a-form-model-item>
            </a-col>
            <a-col :xl="8" :lg="8" :md="8" :sm="24" >
              <a-form-model-item class="form-item"  label="人力成本(人/天)" prop="laborCosts">
                <a-input type="number"  v-model="formData.laborCosts" :disabled="disableSubmit" placeholder="请输入人力成本"/>
              </a-form-model-item>
            </a-col>
            <a-col :xl="8" :lg="8" :md="8" :sm="24">
              <a-form-model-item class="form-item" label="项目状态">
                <j-dict-select-tag
                  :disabled="disableSubmit"
                  v-model="formData.projectStatus"
                  placeholder="请选择项目状态"
                  dict-code="pms_project_status"
                >
                </j-dict-select-tag>
              </a-form-model-item>
            </a-col>
            <!-- <a-col :xl="8" :lg="8" :md="8" :sm="24">
              <a-form-model-item class="form-item" label="项目进度">
                <a-input v-model="formData.projectProgress" :disabled="true" />
              </a-form-model-item>
            </a-col> -->
            <a-col :xl="8" :lg="8" :md="8" :sm="24">
              <a-form-model-item class="form-item" label="项目附件">
                 <j-upload :disabled="disableSubmit" v-model="formData.filePath"></j-upload>
              </a-form-model-item>
            </a-col>
            <a-col :xl="24" :lg="24" :md="24" :sm="24">
              <a-form-model-item :label-col="{span: 2}" :wrapper-col="{span:21}" class="form-item" label="项目描述">
                <j-editor ref="jEditor" :disabled="disableSubmit" v-model="formData.projectDesc"></j-editor>
                <!-- <a-textarea :disabled="disableSubmit" placeholder="项目描述" v-model="formData.projectDesc" :rows="4" /> -->
              </a-form-model-item>
            </a-col>
          </a-row>
        </a-form-model>
        <a-divider orientation="left">操作记录</a-divider>
        <projectlog :param="{projectCode:formData.projectCode}"></projectlog>
      </div>
    </a-modal>
  </div>
</template>
<script>
import JSelectMultiUser from '@/components/jeecgbiz/JSelectMultiUser'
import JTreeSelect from '@/components/jeecg/JTreeSelect'
import JEditor from '@/components/jeecg/JEditor'
import JUpload from '@/components/jeecg/JUpload'
import JSelectDepart from '@/components/jeecgbiz/JSelectDepart'
import moment from 'moment'
import { postAction, putAction } from '@/api/manage'
import Projectlog from '../modules/Projectlog'
import { validateDuplicateValue } from '@/utils/util'
import { mapGetters } from 'vuex'
export default {
  name: 'ProjectListModal',
  components: {
    JSelectMultiUser,
    JTreeSelect,
    JSelectDepart,
    JUpload,
    Projectlog,
    JEditor
  },
  data() {
    return {
      editModalVisible: false,
      disableSubmit: false,
      title: '新增',
      dateFormat: 'YYYY-MM-DD',
      rules: {
        projectName: [
          { required: true, message: '请输入项目名称', trigger: 'blur' }
        ],
        projectCode: [
          { required: true, message: '请输入项目编码', trigger: 'blur' },
          { validator: (rule, value, callback) => validateDuplicateValue('pms_project', 'project_code', value, this.formData.id, callback) }
        ],
        time: [
          { required: true, message: '请选择时间', trigger: 'change' }
        ],
        projectManager: [
          { required: true, message: '请选择负责人', trigger: 'blur' }
        ]
      },
      formData: {
        time: []
      },
      newFormData: {
        startTime: '',
        endTime: '',
        time: [],
        projectStatus: '0',
        projectType: ''
      },
      syncLoading: false,
      url: {
        add: '/pms/project/add',
        edit: '/pms/project/edit'
      },
      formType: '',
      isManager: true,
      labelCol: { span: 6 },
      wrapperCol: { span: 18 }
    }
  },
  methods: {
    ...mapGetters(['userInfo']),
    handleCancleDbSync() {
      this.$refs['ruleForm'].resetFields()
      this.editModalVisible = false
    },
    handleDbSync() {
      this.$refs['ruleForm'].validate(valid => {
        if (valid) {
          this.updateData()
        } else {
          console.log('error submit!!')
          return false
        }
      })
    },
    updateData() {
      this.formData.startTime = moment(this.formData.time[0]).format(this.dateFormat)
      this.formData.endTime = moment(this.formData.time[1]).format(this.dateFormat)
      if (this.formData.id) {
        putAction(this.url.edit, this.formData).then(res => {
          this.editModalVisible = false
          this.$emit('ok')
        })
      } else {
        postAction(this.url.add, this.formData).then(res => {
          this.editModalVisible = false
          this.$emit('ok')
        })
      }
    },
    add() {
      this.formData = { ...this.newFormData }
      this.isManager = true
      this.editModalVisible = true
      this.$nextTick(() => {
        this.$refs.jEditor.reload()
      })
    },
    edit(data) {
      const obj = { ...data }
      obj.time = []
      this.formData = obj
      if (this.formData.startTime && this.formData.endTime) {
        this.formData.time = [moment(this.formData.startTime), moment(this.formData.endTime)]
      }
      this.hasManager()
      this.editModalVisible = true
      this.$nextTick(() => {
        this.$refs.jEditor.reload()
      })
    },
    hasManager() { // 判断是否为项目经理  控制人员禁用
      const username = this.userInfo().username
      const projectManager = this.formData.projectManager ? this.formData.projectManager.split(',') : []
      if (projectManager.length > 0 && projectManager.indexOf(username) >= 0) {
        this.isManager = true
      } else {
        this.isManager = false
      }
    }
  }
}
</script>
<style>
.warp .ant-list-item{
  padding: 6px 0px;
}
.warp .ant-divider{
  margin: 6px 0px;
}
</style>
